import { createApp } from 'vue'
import pinia from './stores'
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import './styles/index.scss'
import ElSvg from './components/SvgIcon/ElSvg'
import './permission'
import { useUserInfoStore } from './stores/userInfo'
//引入全局组件
import Category from "@/components/Category/index.vue"
//引入插件
import {vueEcharts} from "@/plugins/echerts"
//引入mock
import "@/mockServer"


const app = createApp(App)


//按钮权限校验
const userInfoStore = useUserInfoStore(pinia)
app.directive("has" , (el , binding) => {
  //判断如果按钮的自定义指令不在权限中就删除这个按钮
  if(!userInfoStore.userInfo.buttons.includes(binding.value)){
    el.remove()
  }
})


//注册全局组件
app.component("Category" , Category)

ElSvg(app)

app.use(pinia)
  .use(router)
  .use(ElementPlus, {
    locale: zhCn,
  })
  .use(vueEcharts)
  .mount('#app')
